// ss-display-flex-x($class='.hlist', $flex-flow = row nowrap, $justify-content = false, $align-items = false, $align-content = false)

ss-display-flex-x('.flex-row')
ss-display-flex-x('.flex-row-wrap', row wrap)
// .flex-row-wrap
//   ss-display-flex(row wrap, flex-start)
// .flex-row-center
//   ss-display-flex(row nowrap, center)
// .flex-row-end
//   ss-display-flex(row nowrap, flex-end)
// .flex-row-center-center
//   ss-display-flex(row nowrap, center, center, center)
// .flex-row-start-center
//   ss-display-flex(row nowrap, flex-start, center)
// .flex-row-start-end
//   ss-display-flex(row nowrap, flex-start, flex-end)

// .flex-row-between
//   ss-display-flex(row nowrap, space-between)
// .flex-row-between-center
//   ss-display-flex(row nowrap, space-between, center, center)
// .flex-row-between-end
//   ss-display-flex(row nowrap, space-between, flex-end)
// .flex-row-wrap-between-center
//   ss-display-flex(row wrap, space-between, center, center)

.flex-column
  ss-display-flex(column)
// .flex-column-end
//   ss-display-flex(column, flex-end)
// .flex-column-center
//   ss-display-flex(column, center)
// .flex-column-center-center
//   ss-display-flex(column, center, center)
// .flex-column-start-center
//   ss-display-flex(column, flex-start, center)
// .flex-column-between
//   ss-display-flex(column, space-between)
// .flex-column-between-center
//   ss-display-flex(column, space-between, center)

.justify-between
  justify-content: space-between
.justify-center
  justify-content: center
.al-item
  align-items: flex-start
.al-item-center
  align-items: center